import React from "react";
import {Button, Col, Input, Row, Form} from "antd";
import PlatformSelect from "../platform/PlatformSelect";
import RoleSelect from "../role/RoleSelect";
import BaseComponent from "../../../../redare/components/BaseComponent";
import UserPresenter from "../../.gen/presenter/component/core/UserPresenter";
import {ifTrue} from "../../../../redare/utils/Utils";
import PlatformMenuSelect from "../pmenu/PlatformMenuSelect";
import {getLoginUserInfo, isLoginUserInRootPlatform} from "../../utils/WorkbenchUtil";

export default class UserForm extends BaseComponent {

    static defaultProps = {
        onAddSuccess: undefined,
        onEditSuccess: undefined
    };

    constructor(props) {
        super(props);
        this.state = {data: {}};
        this.presenter = new UserPresenter(this);
        this._user = getLoginUserInfo();
        this._isRoot = isLoginUserInRootPlatform();
        this._form.platform = this._user.platform;
    }

    componentDidMount() {
        if (ifTrue(this.props.id)) {
            this.presenter.getUser({id: this.props.id}, {}, (result) => {
                this.form.setFieldsValue(result.data);
                this.setState({data: result.data});
            });
        }
    }

    _closeForm() {
        if (this.props.onCancel) {
            this.props.onCancel();
        }
    }

    _onSubmit() {
        this.form.validateFields().then(values => {
            if (this.props.id) {
                this.showDoingIndicator('处理中');
                this.presenter.modifyUser({where: {userId: this.props.id}, ...values}, {}, () => {
                    this.noticeSuccess("编辑成功");
                    if (this.props.onEditSuccess) {
                        this.props.onEditSuccess();
                    }
                });
            } else {
                let {pwd, confirmPwd} = values;
                if (pwd !== confirmPwd) {
                    this.toastFail("两次密码输入不一致");
                    return;
                }
                this.showDoingIndicator('处理中');
                this.presenter.addUser(values, {}, () => {
                    this.noticeSuccess("添加成功");
                    if (this.props.onAddSuccess) {
                        this.props.onAddSuccess();
                    }
                });
            }
        });
    }

    showLoadingIndicator(text) {
        this.showSpin(text);
    }

    closeLoadingIndicator() {
        this.closeSpin();
    }

    showDoingIndicator(text) {
        this.showSpin(text);
    }

    closeDoingIndicator() {
        this.closeSpin();
    }

    render() {
        const formItemLayout = {
            labelCol: {
                span: 4
            },
            wrapperCol: {
                span: 20
            },
        };
        return this.renderSpin(
            <Form ref={(o) => this.form = o} className="form" {...formItemLayout}
                  initialValues={(
                      {
                          platform: this._form.platform
                      }
                  )}>
                {
                    (!ifTrue(this.props.id) && this._isRoot) && (
                        <Form.Item label="所属平台" name="platform" rules={[{required: true, message: '请选择所属平台！'}]}
                                   trigger="onValueChange" validateTrigger="onValueChange">
                            <PlatformSelect onValueChange={(value) => {
                                this._form.platform = value;
                                this.refreshState()
                            }}/>
                        </Form.Item>
                    )
                }
                {
                    ifTrue(this.props.id) ? (
                        <>
                            {
                                this.state.modifyAccount ? (
                                    <Row>
                                        <Form.Item label="账号" name="account"
                                                   rules={[{required: true, message: '请输入账号！'}]}
                                                   labelCol={({span: 6})}
                                                   wrapperCol={({span: 18})}
                                                   style={({width: 315})}>
                                            <Input placeholder="请输入账号" style={({width: 235})}/>
                                        </Form.Item>
                                        <Button style={({marginLeft: 10})}
                                                type="danger"
                                                size="small"
                                                onClick={() => this.setState({modifyAccount: false})}>取消修改</Button>
                                    </Row>
                                ) : (
                                    <Form.Item label="账号">
                                        <div>
                                            <span>{this.state.data.account}</span>
                                            <Button style={({marginLeft: 10})}
                                                    size="small"
                                                    onClick={() => this.setState({modifyAccount: true})}>修改账号</Button>
                                        </div>
                                    </Form.Item>
                                )
                            }
                        </>
                    ) : (
                        <Form.Item label="账号" name="account" rules={[{required: true, message: '请输入账号！'}]}>
                            <Input placeholder="请输入账号"/>
                        </Form.Item>
                    )
                }
                <Form.Item label="用户名" name="name" rules={[{required: true, message: '请输入用户名！'}]}>
                    <Input placeholder="请输入用户名"/>
                </Form.Item>
                {
                    !ifTrue(this.props.id) && (
                        <Form.Item label="登录密码" name="pwd" rules={[{required: true, message: '请输入登录密码！'}]}>
                            <Input.Password placeholder="请输入登录密码"/>
                        </Form.Item>
                    )
                }
                {
                    !ifTrue(this.props.id) && (
                        <Form.Item label="确认密码" name="confirmPwd" rules={[{required: true, message: '请再次输入登录密码！'}]}>
                            <Input.Password placeholder="请再次输入登录密码"/>
                        </Form.Item>
                    )
                }
                {
                    !ifTrue(this.props.id) && this._form.platform && (
                        <Form.Item label="用户菜单" name="menuId" trigger="onValueChange" validateTrigger="onValueChange">
                            <PlatformMenuSelect platform={this._form.platform}/>
                        </Form.Item>
                    )
                }
                {
                    !ifTrue(this.props.id) && this._form.platform && (
                        <Form.Item label="用户角色" name="roleIds" trigger="onValueChange" validateTrigger="onValueChange">
                            <RoleSelect platform={this._form.platform}/>
                        </Form.Item>
                    )
                }
                <Form.Item label="手机号" name="mobile">
                    <Input placeholder="请输入手机号"/>
                </Form.Item>
                <Form.Item label="email" name="email">
                    <Input placeholder="请输入email"/>
                </Form.Item>
                <Row type="flex" justify="end">
                    <Col>
                        <Button onClick={this._closeForm.bind(this)}>
                            取消
                        </Button>
                    </Col>
                    <Col offset={1}>
                        <Button type="primary" onClick={this._onSubmit.bind(this)}>
                            保存
                        </Button>
                    </Col>
                </Row>
            </Form>
        );
    }
}
